<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>制作开心网页游戏</title>
		<link href="style.css" rel="stylesheet" />
	</head>

	<body>
		<div class="box clearfix">
			<div class="top_nav clearfix">
				<div class="logo fl">
					<a href="#"><img src="images/gameLogo.png" /></a>
				</div>
				<div class="home fl">
					<a href="#">首页</a>
				</div>
				<div class="login fr">
					<ul class="denglv">
						<li>
							<a href="#">注册 </a>|</li>
						<li>
							<a href="#">登录 </a>|</li>
						<li>
							<a href="#">帮助 </a>|</li>
						<li>
							<a href="#">更多 </a>
						</li>
					</ul>
				</div>
			</div>
			<div class="con_1 clearfix">
				<ul class="youxi fl">
					<li>
						<div class="img"><img src="images/sub-2.gif" /></div>
						<div class="txt">征战四方</div>
					</li>
					<li>
						<div class="img"><img src="images/sub-3.gif" /></div>
						<div class="txt">龙将</div>
					</li>
					<li>
						<div class="img"><img src="images/sub-4.gif" /></div>
						<div class="txt">弹弹堂</div>
					</li>
					<li>
						<div class="img"><img src="images/sub-5.gif" /></div>
						<div class="txt">凡人修真2</div>
					</li>
					<li>
						<div class="img"><img src="images/sub-6.gif" /></div>
						<div class="txt">一骑当先</div>
					</li>
					<li>
						<div class="img"><img src="images/sub-7.gif" /></div>
						<div class="txt">宫廷计</div>
					</li>
					<li>
						<div class="img"><img src="images/sub-8.gif" /></div>
						<div class="txt">神仙道</div>
					</li>
				</ul>
				<div class="bg_img fl">
					<img src="images/xdtgg_frxz2_44.jpg" />
					<div class="img_nav">
						<span>1</span>
						<span>2</span>
						<span>3</span>
						<span>4</span>
					</div>
				</div>
				<div class="form fr">
					<p><strong>开心用户登录</strong></p>
					<div class="username">账号：<input type="text" placeholder="字母，数字的六位字符" /></div>
					<div class="psw">密码：<input type="password" placeholder="四位数字" /></div>
					<!--<img src="images/btnLogin.jpg" />-->
					<div class="btn"><input type="image"  src="images/btnLogin.jpg" ></div>
					<div class="zhuce">
						<a href="#">立即注册</a>
						<a href="#">忘记密码</a>
					</div>
				</div>
			</div>
			<div class="con_2 clearfix">
				<div class="people fl">
					<div class="con_nav">
						<ul>
							<li><h3>全部游戏</h3></li><!--<li><a href="#">全部游戏</a></li>-->
							<li><a href="#">战争策略</a>|</li>
							<li><a href="#">体育经营</a>|</li>
							<li><a href="#">社交游戏</a></li>
						</ul>
					</div>
					<div class="game_people clearfix">
						<div class="game_people1 fl">
							<div class="img fl"><img src="images/img-4.jpg"/></div>
							<div class="txt fl">
								<p>三国题材横版RPG网游，丰富的武将系统</p>
								<p>类型：角色扮演</p>
								<p>游戏人气：<span class="nom">470921</span></p>
								<p class="clearfix"><span class="xuanfu fl">选服</span><span class="to_game fl">进入游戏</span></p>
							</div>
						</div>
						<div class="game_people1 fl">
							<div class="img fl"><img src="images/img-5.jpg"/></div>
							<div class="txt fl">
								<p>三国题材横版RPG网游，丰富的武将系统</p>
								<p>类型：角色扮演</p>
								<p>游戏人气：<span class="nom">470921</span></p>
								<p class="clearfix"><span class="xuanfu fl">选服</span><span class="to_game fl">进入游戏</span></p>
							</div>
						</div>
					</div>
				</div>
				<div class="news fr">
					<h3>新闻公告</h3>
					<ul>
						<li>[征战四方] 开心首服·黄巾之乱</li>
						<li>[龙将] 火爆8服·八门金</li>
						<li>[弹弹堂] 41服开启·万人竞技</li>
						<li>[凡人修真2] 03月08日·四海帝王</li>
						<li>[一骑当先] 开心2服上线送黄金</li>
						<li>[宫廷计] 03月06日·西施秘史</li>
						<li>[凡人修真2] 03月08日·四海帝王</li>
					</ul>
				</div>
			</div>
			<div class="con_3 clearfix">
				<div class="colsplay fl">
					<h3>角色扮演</h3>
					<ul class="clearfix">
						<li>
							<img src="images/img-6.jpg"/>
							<p>游戏人气：1765314</p>
							<p>游戏状态：<span class="area">22区开启</span></p>
							<p class="clearfix"><span class="xuanfu fl">选服</span><span class="to_game fl">进入游戏</span></p>
						</li>
						<li>
							<img src="images/img-7.jpg"/>
							<p>游戏人气：1245814</p>
							<p>游戏状态：<span class="area">23区开启</span></p>
							<p class="clearfix"><span class="xuanfu fl">选服</span><span class="to_game fl">进入游戏</span></p>
						</li>
						<li>
							<img src="images/img-8.jpg"/>
							<p>游戏人气：1232158</p>
							<p>游戏状态：<span class="area">25区开启</span></p>
							<p class="clearfix"><span class="xuanfu fl">选服</span><span class="to_game fl">进入游戏</span></p>
						</li>
						<li>
							<img src="images/img-9.jpg"/>
							<p>游戏人气：123745</p>
							<p>游戏状态：<span class="area">18区开启</span></p>
							<p class="clearfix"><span class="xuanfu fl">选服</span><span class="to_game fl">进入游戏</span></p>
						</li>
						<li>
							<img src="images/img-10.jpg"/>
							<p>游戏人气：178501</p>
							<p>游戏状态：<span class="area">火爆开启</span></p>
							<p class="clearfix"><span class="xuanfu fl">选服</span><span class="to_game fl">进入游戏</span></p>
						</li>
						<li>
							<img src="images/img-11.jpg"/>
							<p>游戏人气：983014</p>
							<p>游戏状态：<span class="area">2区开启</span></p>
							<p class="clearfix"><span class="xuanfu fl">选服</span><span class="to_game fl">进入游戏</span></p>
						</li>
						<li>
							<img src="images/img-12.jpg"/>
							<p>游戏人气：745214</p>
							<p>游戏状态：<span class="area">4区开启</span></p>
							<p class="clearfix"><span class="xuanfu fl">选服</span><span class="to_game fl">进入游戏</span></p>
						</li>
						<li>
							<img src="images/img-13.jpg"/>
							<p>游戏人气：654814</p>
							<p>游戏状态：<span class="area">火爆开启</span></p>
							<p class="clearfix"><span class="xuanfu fl">选服</span><span class="to_game fl">进入游戏</span></p>
						</li>
					</ul>
				</div>
				<div class="video fr">
					<div class="media">
						<img src="images/ad1.jpg" />
						<img src="images/ad2.jpg" />
					</div>
					<div class="game_video">
						<h3>游戏视频</h3>
						<ul>
							<li class="clearfix">
								<div class="img fl">
									<img src="images/img-1.jpg" />
								</div>
								<div class="txt fr">
									<a href="#">《航海之王》麻辣炫酷反穿越，英雄时尚大变身！</a>
								</div>
							</li>
							<li class="clearfix">
								<div class="img fl">
									<img src="images/img-2.jpg" />
								</div>
								<div class="txt fr">
									<a href="#">《弹弹堂》吴克群同名激情主题MV,体验修真乐趣</a>
								</div>
							</li>
						</ul>
					</div>
				</div>
			</div>
			<div class="bottom clearfix">
				<div class="about fl">
					<a href="#">关于我们</a>
					<a href="#">手机版</a>
					<a href="#">开放平台 </a>
					<a href="#">自助广告 </a>
					<a href="#">招聘 </a>
					<a href="#">客服 </a>
					<a href="#">帮助  </a>
				</div>
				<div class="copy fr">
					<a href="#"> @2017开心网</a>
					<a href="#">文网文[2009]157号</a>
					<a href="#">京ICP证080482号</a>
					<a href="#">京公网安备110000000003号 未成年人家长监护</a>
				</div>
			</div>
			<div class="adv">
				<img src="images/ad3.jpg" />
			</div>
		</div>
	</body>

</html>